<template>
	<view class="is-join-wrapper">
		<image class="img" src="https://static.inclusionconf.com/static/images/chat/chanyeduiijehui.png" mode="" mode="widthFix"></image>
		<view class="title"> 您如果有商业交流的需求，<br />可申请开通“在线交流”功能</view>
		<view class="content">*注:官方资质认证为人工审核，预计需要3-5小时*</view>
		<div class="btns">
			<div class="btn" @click="close">取消</div>
			<div class="btn on" @click="toCard">
				开始
				<image class="icon" src="https://static.inclusionconf.com/static/images/chat/business-right-icon.png" mode="widthFix"></image>
			</div>
		</div>
	</view>
</template>

<script>
	export default {
		methods: {
			close() {
				uni.navigateTo({
					url: '/pages/xingcheng/helperSec'
				})
			},
			toCard() {
				uni.navigateTo({
					url: '/pages/business/card'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.is-join-wrapper {
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding: 10% 0;
		position: relative;
		box-sizing: border-box;
		background: url(https://static.inclusionconf.com/static/images/chat/card-bg-new-t1.jpg) no-repeat;
		background-size: 100% 100%;
		background-color: #8E6AFF;

		.img {
			width: 80px;
		}

		.title {
			font-family: AlibabaPuHuiTi_3_75_SemiBold;
			font-size: 20px;
			color: #fff;
			line-height: 27px;
			text-align: center;
			font-style: normal;
			margin: 16px 0 14px;
		}

		.content {
			margin-bottom: 15%;
			width: 616rpx;
			font-family: AlibabaPuHuiTi_3_45_Light;
			font-size: 13px;
			color: rgba(255, 255, 255, 0.8);
			line-height: 18px;
			text-align: center;
			font-style: normal;
		}

		.btns {
			position: absolute;
			left: 0;
			bottom: 26px;
			width: 100%;
			display: flex;
			justify-content: center;
			
			.btn {
				display: block;
				width: 260rpx;
				height: 40px;
				border-radius: 20px;
				font-family: AlibabaPuHuiTi_2_65_Medium;
				font-size: 16px;
				color: #fff;
				line-height: 20px;
				display: flex;
				justify-content: center;
				align-items: center;
				font-style: normal;
				border: 1px solid #FFFFFF;
				margin: 0 5px;

				&.on {
					background: #fff;
					color: #7350F5;
					display: flex;
					align-items: center;
					
					.icon {
						width: 14px;
						margin-left: 8px;
					}
				}
			}
		}
	}
</style>